import type {Preset, SourceCodeTransformer} from 'unocss'
import {defineConfig, presetAttributify, transformerVariantGroup} from 'unocss'
import transformerDirectives from '@unocss/transformer-directives'

import {
    presetApplet,
    presetRemRpx,
    transformerAttributify,
} from 'unocss-applet'

// uni-app
const isApplet = process.env?.UNI_PLATFORM?.startsWith('mp') ?? false
// taro
// const isApplet = process.env.TARO_ENV !== 'h5' ?? false
const presets: Preset[] = []
const transformers: SourceCodeTransformer[] = [
    // 启用 @apply 功能
    transformerDirectives({
        applyVariable: ['--at-apply', '--uno-apply', '--uno', '--ay'],
    }),
    // 启用 () 分组功能
    // 支持css class组合，eg: `<div class="hover:(bg-gray-400 font-medium) font-(light mono)">测试 unocss</div>`
    transformerVariantGroup()
]

if (isApplet) {
    presets.push(presetApplet())
    presets.push(presetRemRpx())
    transformers.push(transformerAttributify({
        ignoreAttributes: ['block'], prefixedOnly: true,
        prefix: "fg",
    }))
} else {
    presets.push(presetApplet())
    presets.push(presetAttributify())
    presets.push(presetRemRpx({mode: 'rpx2rem'}))
}

export default defineConfig({
    presets: [
        // ...
        ...presets,
    ],
    /**
     * 自定义快捷语句
     * @see https://github.com/unocss/unocss#shortcuts
     */
    transformers: [
        // ...
        ...transformers,
    ],
    shortcuts: [["center", "flex justify-center items-center"]],
    rules: [
        [
            "my-p",
            {
                padding: "8px",
            },
        ],
    ],
})